Motivation

• Prevent excessive writes when the color input is changed rapidly by debouncing persistence of the canvas color setting.
• Ensure any pending color write is flushed when the settings panel unmounts to avoid losing the last user change.
• Allow immediate persistence when the color is explicitly cleared.

Description

• Introduced COLOR_WRITE_DEBOUNCE_MS, a PendingColorWrite type, and a writeColorSetting helper to centralize color persistence logic.
• Added useRef hooks (colorWriteTimeoutRef and pendingColorWriteRef) and utility functions clearColorWriteTimeout, persistColor, and persistColorAfterPause to debounce writes and manage pending state.
• Updated the color input handler to call persistColorAfterPause and updated the clear (Icon click) handler to clear the timeout and call persistColor for immediate persistence.
• Added a cleanup useEffect to flush any pending color write on unmount.

Testing

• Ran TypeScript type-check and linting (tsc / linter) and they passed.
• Ran the project's unit tests and they passed.
• Performed a development build locally and it completed successfully.

Codex Task